<template>
	<span :style class="divider"></span>
</template>

<script setup lang="ts">
	import { computed } from 'vue';

	type DividerType = 'horitical' | 'vertical'
	const { type, len = 100 } = defineProps<{
		type : DividerType,
		len ?: number
	}>()


	const style = computed(() =>
		type === 'horitical' ? `width:${len}%;height:1px;background:#888` : `width:1px;height:${len}%;background:#888`
	)
</script>

<style scoped>
	.divider{
		margin: 5px;
	}
</style>